<template>
  <div class="about">
    <h1>This is an about page</h1>
    <input type="text" v-model="id">
    <button @click="toList">跳转到list</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      id: ""
    }
  },
  methods: {
    toList() {
      //路由对象进行跳转
      console.log(this.$router);
      //$routh表示VueRouter实例化对象,包含路由的方法
      // this.$router.push({
      //   path : "/list",
      //   query:{
      //     id:this.id
      //   }
      //   })

      //动态路由,用name跳转,params传参
      this.$router.push({
        name: "list",
        params: {
          id: this.id
        }
      });
    }
  }
};
</script>

